<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh">
<head>
    <title>后台管理</title>
    <%@include file="../common/common.jsp"%>
</head>

<body>

<%@include file="navTop.jsp"%>
<div class="container-fluid">
    <div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
            <ul class="nav nav-sidebar">
                <li class="active"><a href="<%=path%>/admin/scenic_spot">景区管理</a></li>
            </ul>
            <ul class="nav nav-sidebar">
                <li><a href="<%=path%>/admin/hotel">酒店管理</a></li>
            </ul>
            <ul class="nav nav-sidebar">
                <li><a href="<%=path%>/admin/ticket">票务管理</a></li>
            </ul>
            <ul class="nav nav-sidebar">
                <li><a href="<%=path%>/admin/user">用户管理</a></li>
            </ul>
            <ul class="nav nav-sidebar">
                <li><a href="<%=path%>/admin/index">首页设置</a></li>
            </ul>
        </div>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <h2 class="sub-header text-center">添加景区</h2>
            <div class="row">
                <div class="col-md-1">
                    <label class="text-left" style="width: 100%;line-height: 34px;">主标题：</label>
                </div>
                <div class="col-md-4">
                    <input type="text" class="form-control" id="mainTitle"  placeholder="20字以内"/>
                </div>
                <div class="col-md-1">
                    <label class="text-right" style="width: 100%;line-height: 34px;" >副标题：</label>
                </div>
                <div class="col-md-4">
                    <input type="text" class="form-control" id="subTitle" placeholder="20字以内"/>
                </div>
            </div>
            <div class="row">
                <div class="col-md-1">
                    <label class="text-left" style="width: 100%;line-height: 34px;">简单描述：</label>
                </div>
                <div class="col-md-9">
                    <input type="text" class="form-control" id="descr"  placeholder="20字以内"/>
                </div>
            </div>
            <hr>
            <div class="row">
                <div class="col-md-10">
                    <label class="text-left" style="width: 100%;line-height: 34px;">简介：</label>
                    <textarea class="form-control" id="synopsis" style="width:1000px;height:100px;resize:none;"
                              placeholder="简介"></textarea>
                </div>
            </div>
            <hr>
            <div class="row">
                <div class="col-md-2" style="width: 10%;padding-right: 0;">
                    <label class="text-left" style="width: 100%;line-height: 34px;">内容一标题：</label>
                </div>
                <div class="col-md-8">
                    <input type="text" class="form-control" id="titleOne" placeholder="20字以内">
                </div>
            </div>
            <div class="row">
                <div class="col-md-10">
                    <label class="text-left" style="width: 100%;line-height: 34px;">内容一：</label>
                    <textarea id="titleOneDetail" class="form-control" style="width:1000px;height:100px;resize:none;"
                              placeholder="内容一"></textarea>
                </div>
            </div>
            <hr>
            <div class="row">
                <div class="col-md-2" style="width: 10%;padding-right: 0;">
                    <label class="text-left" style="width: 100%;line-height: 34px;">内容二标题：</label>
                </div>
                <div class="col-md-8">
                    <input type="text"id="titleTwo" class="form-control" placeholder="20字以内">
                </div>
            </div>
            <div class="row">
                <div class="col-md-10">
                    <label class="text-left" style="width: 100%;line-height: 34px;">内容二：</label>
                    <textarea id="titleTwoDetail" class="form-control" style="width:1000px;height:100px;resize:none;"
                              placeholder="内容二"></textarea>
                </div>
            </div>
            <hr>
            <div class="row">
                <div class="col-md-2" style="width: 10%;padding-right: 0;">
                    <label class="text-left" style="width: 100%;line-height: 34px;">内容三标题：</label>
                </div>
                <div class="col-md-8">
                    <input id="titleThree" type="text" class="form-control" placeholder="20字以内">
                </div>
            </div>
            <div class="row">
                <div class="col-md-10">
                    <label class="text-left" style="width: 100%;line-height: 34px;">内容三：</label>
                    <textarea id="titleThreeDetail" class="form-control" style="width:1000px;height:100px;resize:none;"
                              placeholder="内容三"></textarea>
                </div>
            </div>
            <hr>

            <div class="row">
                <div class="col-md-1">
                    <label class="text-left" style="width: 100%;line-height: 34px;">地址：</label>
                </div>
                <div class="col-md-4">
                    <input type="text" id="address" class="form-control" placeholder="30字以内">
                </div>
                <div class="col-md-1">
                    <label class="text-left" style="width: 100%;line-height: 34px;">电话：</label>
                </div>
                <div class="col-md-4">
                    <input type="text" id="phone" class="form-control" placeholder="电话">
                </div>
            </div>
            <div class="row">
                <div class="col-md-1">
                    <label class="text-left"  style="width: 100%;line-height: 34px;">星级：</label>
                </div>
                <div class="col-md-4">
                    <select class="form-control" id="star">
                        <option>A</option>
                        <option>AA</option>
                        <option>AAA</option>
                        <option>AAAA</option>
                        <option>AAAAA</option>
                    </select>
                </div>
                <div class="col-md-1">
                    <label class="text-left" style="width: 100%;line-height: 34px;">附近酒店：</label>
                </div>
                <div class="col-md-4">
                    <input type="text" id="nearbyHotel" class="form-control" placeholder="30字以内">
                </div>
            </div>
            <div class="row">
                <div class="col-md-1">
                    <label class="text-left" style="width: 100%;line-height: 34px;">路线：</label>
                </div>
                <div class="col-md-4">
                    <input type="text" id="route" class="form-control" placeholder="30字以内">
                </div>
                <div class="col-md-1">
                    <label class="text-left" style="width: 100%;line-height: 34px;">价格：</label>
                </div>
                <div class="col-md-4">
                    <input type="text" class="form-control" id="price" placeholder="价格">
                </div>
            </div>
            <hr>
            <div class="row">
                <div class="col-md-10">
                    <label class="text-left"
                           style="width: 100%;line-height: 34px;">图片：第一张上传为封面图(建议尺寸200*200)，第二张为地图(建议尺寸200*200)，第三张为内容图1(建议最大高度不超过300)，第四张为内容图2</label>
                    <form>
                        <input id="file-1" type="file" name="file" multiple class="file"
                               data-overwrite-initial="false" data-min-file-count="1">
                    </form>
                </div>
            </div>
            <div class="row" style="text-align: center;">
                <div class="col-md-10">
                    <button type="button" class="btn signin_btn" id="btnSubmit">
                        保存
                    </button>
                </div>
            </div>

        </div>


    </div>
</div>
<script type="text/javascript">
    var imgNames=[];
    $("#file-1").fileinput({
        uploadUrl: CONTEXT_PATH+'/admin/ScenicSpotMangage/upload',
        showPreview: true,//是否显示文件预览
        allowedFileExtensions: ['jpg', 'png', 'gif'],
        overwriteInitial: false,
        maxFileSize: 1000,
        maxFileCount: 4,
        dropZoneEnabled: true,//拖拽图片
        uploadLabel: "上传",
        showUpload: true,
        maxImageWidth: 950,//图片的最大宽度
        maxImageHeight: 500,//图片的最大高度
        initialCaption: "请上传",
        dropZoneTitle: "可以将图片拖放到这里",
        enctype: 'multipart/form-data',
        layoutTemplates: {
            actionUpload: '',//去除上传预览缩略图中的上传图片
            actionZoom: '',   //去除上传预览缩略图中的查看详情预览的缩略图标
            actionDownload: '', //去除上传预览缩略图中的下载图标
            actionDelete: '', //去除上传预览的缩略图中的删除图标
        },//对象用于渲染布局的每个部分的模板配置。您可以设置以下模板来控制窗口小部件布局.eg:去除上传图标

    }).on('fileuploaded', function (event, data, previewId, index) {//上传成功
        /* $("#fileName").val(data.response[0].fileName);
        $("#eosid").val(data.response[0].eosid); */
        console.log(data.response);
        if(data.response!=="error"){
            imgNames.push(data.response);
        }else{
            swal("","上传失败！发生错误！","error")
        }
    }).on('fileerror', function (event, data, msg) {//上传失败
        swal("错误！",data,"error")
    });

    var initcond=function () {
        var cond = {};
        var mainTitle=$("#mainTitle").val();
        var subTitle=$("#subTitle").val();
        var synopsis=$("#synopsis").val();
        var titleOne=$("#titleOne").val();
        var titleOneDetail=$("#titleOneDetail").val();
        var titleTwo=$("#titleTwo").val();
        var titleTwoDetail=$("#titleTwoDetail").val();
        var titleThree=$("#titleThree").val();
        var titleThreeDetail=$("#titleThreeDetail").val();
        var address=$("#address").val();
        var phone=$("#phone").val();
        var star=$("#star").val();
        var nearbyHotel=$("#nearbyHotel").val();
        var route=$("#route").val();
        var descr=$("#descr").val();
        var price=$("#price").val();
        if(!Util.nvl(mainTitle)&&!Util.nvl(subTitle)&&!Util.nvl(synopsis)&&
            !Util.nvl(titleOne)&&!Util.nvl(titleOneDetail)&&!Util.nvl(titleTwo)&&
            !Util.nvl(titleTwoDetail)&&!Util.nvl(titleThree)&&!Util.nvl(titleThreeDetail)&&
            !Util.nvl(address)&&!Util.nvl(phone)&&!Util.nvl(star)&&!Util.nvl(price)&&
            !Util.nvl(nearbyHotel)&&!Util.nvl(route)&&!Util.nvl(descr)){
            cond['mainTitle'] = mainTitle;
            cond['subTitle'] = subTitle;
            cond['synopsis'] = synopsis;
            cond['titleOne'] = titleOne;
            cond['titleOneDetail'] = titleOneDetail;
            cond['titleTwo'] = titleTwo;
            cond['titleTwoDetail'] = titleTwoDetail;
            cond['titleThree'] = titleThree;
            cond['titleThreeDetail'] = titleThreeDetail;
            cond['address'] = address;
            cond['phone'] = phone;
            cond['star'] = star;
            cond['nearbyHotel'] = nearbyHotel;
            cond['route'] = route;
            cond['descr'] = descr;
            cond['price'] = price;
        }else{
            swal("","请输入全部内容！","warning");
            return ;
        }

        if(imgNames.length!==4){
            swal("","请先上传图片！","warning");
            return ;
        }
        cond['imgNames'] = imgNames;
        console.log(cond);
        return cond;
    };
    var btnSubmit=function(){

        var cond=initcond();
        if(!cond){
            return;
        }
        var param = Param.getReadCmd();
        param[Param.CMDTYPEKEY] = 2;
        param[Param.CMDVALUEKEY] = 1;

        //Param.buildPagingParam(param, 1,20);
        Param.buildParam(param, cond);
        console.log(JSON.stringify(param));
        Util.doPost("/admin/ScenicSpotMangage/insert",param,function(result){
            console.log(param);
        });
    };
    $(function () {
        $("#btnSubmit").click(function () {
            btnSubmit();
        });
    });
</script>
<style>
    .btn.signin_btn,
    .btn.signin_btn:focus {
        width: 620px;
        padding: 0;
        height: 60px;
        background: #5a84fd;
        color: #fff;
        font-size: 30px;
        text-transform: uppercase;
        border-radius: 3px;
        box-shadow: 0 5px 30px rgba(0, 66, 255, .3);
        margin-top: 20px;
    }

</style>


</body>

</html>